// 加载公共样式
require('../../assets/css/public.less')

// 引入自己样式
require('./home.less')

// 引入swiper的css
require('swiper/dist/css/swiper.min.css')


// 引入swiper
const mySwiper = require('swiper')

//获取axios工具函数
const request = require('../../lib/request/request.js')
// Swiper
window.onload = () => {
  let mySwiper = new Swiper('.swiper-container', {
    autoplay: 1000,//可选选项，自动滑动
    loop: true,
    // 如果需要分页器
    pagination: '.swiper-pagination',
  })

  function $(selector) {
    return document.querySelector(selector)
  }
  function $a(selector) {
    return document.querySelectorAll(selector)
  }

  // 点击底部导航切换激活样式

  $a('.nav').forEach(function (v, i) {
    v.addEventListener('click', function () {
      $a('.iconfont').forEach(function (v1, i2) {
        // 清除所有样式
        v1.classList.remove('active')
        $a('.navText')[i2].classList.remove('active')
      })
      // 给当前添加样式
      $a('.iconfont')[i].classList.add('active')
      $a('.navText')[i].classList.add('active')
    })

  })
  //获取打卡信息
  function getClockInfo() {
    console.log(1);
    request.get('/api/user/clockInInfo').then(res => {
      console.log(2);
      //解构数据
      let { errno, data } = res.data
      //判断
      if (errno === 0) {
        console.log('data.isClockIn :>> ', data.isClockIn)
        if (data.isClockIn) {
          clock.textContent = '已打卡'
          clock.classList.add("clock1")
          clock.classList.remove("dayCard")
        } else {
          clock.textContent = '今日打卡'
          clock.classList.add("dayCard")
          clock.classList.remove("clock1")
        }
      }
    })
  }
  //初始化调用一次
  getClockInfo()

  //获取用户信息
  function getUserInfo() {
    request.get('/api/user/info').then(res => {
      //1 解构数据
      let { errno, data } = res.data
      //2 判断
      if (errno === 0) {
        //3 处理业务逻辑
        render(data)
      }
    })
  }

  //渲染函数 渲染dom更新dom
  function render(data) {
    rankNo.textContent = data.ranking
    clockDay.textContent = data.clockCount
    badge.textContent = data.badges
  }

  //初始化调用一次
  getUserInfo()

  //引入tabbar渲染函数
  const renderTabbar = require('../../lib/tabbar/tabbar')

  //渲染tabbar
  renderTabbar('home')
}









